Vue Js Alert on Click Button: In
Vue.js, the built-in alert function from JavaScript can be used to create a simple alert box, but it has limited functionality. The alert box created by this function only has a single button for dismissal and cannot be customized beyond its default appearance.You can customize the message in the alert by changing the argument passed to window.alert()
. For example, window.alert('Hello, world!')
would show an alert with the text “Hello, world!”. In this tutorial we will learn how to Pop Up Alert box on click button.
How to Implement Alert Box in Vue Js?
The app has a button element that triggers a method called “showAlert” when clicked. The “showAlert” method displays an alert window with the message “Button clicked!” using the window.alert() method.Overall, the code creates a simple button with an alert message functionality using Vue.js.
Vue Js Alert Notification | Example
<div id="app">
<button v-on:click="showAlert">Click me</button>
</div>
<script type="module">
const app = Vue.createApp({
methods: {
showAlert() {
window.alert('Button clicked!')
}
}
});
app.mount('#app');
</script>